<template>
  <h1>DzDemo - DInput</h1>
  <h2>msg：{{ msg }}</h2>
  <d-input
    v-model="msg"
    placeholder="DInput .vue版"
    @focus="focusHandler"
    @blur="blurHandler"
  />
  <hr>
  <d-input-j-s-x v-model="msg" placeholder="DInput .tsx版"/>
</template>

<script>
import { defineComponent, ref } from 'vue'

export default defineComponent({
  name: 'DzDemo',
  setup () {
    const msg = ref('Hello world!')

    function focusHandler (info) {
      console.log('focus：', info)
    }

    function blurHandler (info) {
      console.log('blur：', info)
    }

    return {
      msg,
      focusHandler,
      blurHandler
    }
  }
})
</script>

<style scoped>

</style>
